<?php
include_once("../../php/include_all.php");
session_start();
?>
<div class="row-fluid">
	<div class="span12">
		<h3 class="page-title">
            <b>Data Komponen</b>
        </h3>
		       <a href="#modalwin" data-toggle="modal" class="btn btn-primary btn-tambah">Tambah Komponen</a>
        <div id="modalwin" class="modal hide fade" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">

             <header class="modal-header">
			<a href="#" class="close geo-clear" data-dismiss="modal">x</a>
                <h3>Data Komponen</h3>
            </header>
            <div class="modal-body">
              <form id="form_komponen"  class="form-horizontal">
					<input type="hidden" name="act" value="komponen_action">
					<input type="hidden" id="id_komponen" name="id_komponen" value="0">
					<div class="control-group">
                        <label class="control-label">Bidang</label>
                        <div class="controls">
                            <select name="id_bidang" id="id_bidang">
								<option id="id_bidang" value="0">Pilih salah satu</option>
								<?php
									$bid = get_datas("select distinct b.id_bidang,b.nama_bidang from spm_skpd s,spm_bidang_urusan b, spm_jenis_pelayanan j,spm_indikator i where i.id_pelayanan=j.id_pelayanan AND b.id_bidang=j.id_bidang AND i.id_skpd=".$_SESSION['_id']."");
									foreach($bid as $bid){
								?>
									<option value=<?php echo $bid['id_bidang']; ?>><?php echo $bid['nama_bidang']; ?></option>
								<?php
								}
								?>
							</select>
                        </div>
					</div>
					<div class="control-group">
                        <label class="control-label">Nama Komponen</label>
                        <div class="controls">
                            <input type="text" id="nama_komponen" name="nama_komponen" class="input-xlarge" />
                        </div>
					</div>
					<div class="control-group">
                        <label class="control-label">Satuan</label>
                        <div class="controls">
                            <input type="text" id="nama_satuan" name="satuan" class="input-small" />
                        </div>
					</div>
                      <a class="btn btn-primary bt-simpan-komponen"><div id="loader" style="margin-top:2px"></div>&nbsp;Save</a>
                                <span id="result"></span>
				</form>
            </div>
		</div>
	</div>
	</div>
	</br>
	<div class="row-fluid">
        <div class="span12">
			<div class="widget" style="">
                <div class="widget-title">
                    <h4><i class="icon-reorder"></i>Tabel Komponen</h4>
                    <span class="tools">
                        <a href="javascript:;" class="icon-chevron-down"></a>
                    </span>
                </div>
				<div class="widget-body">
                    <table class="table table-striped table-bordered" id="sample_1">
                    <thead>
                        <tr>
                            <th class="hidden-phone" style="width:20px; text-align:center;">No</th>
                            <th style="text-align:center;">Nama Bidang</th>
                            <th style="text-align:center;">Nama Komponen</th>
                            <th style="text-align:center;">Satuan</th>
							<th style="text-align:center;">Edit</th>
                        </tr>
                    </thead>
                    <tbody id="tb-komponen">
					<?php 
					$no=1;
					$komp = get_datas("select * from spm_skpd s, spm_bidang_urusan b,spm_komponen k where s.id_skpd=".$_SESSION['_id']." AND s.id_bidang=k.id_bidang AND k.id_bidang=b.id_bidang");
					foreach ($komp as $komp){
					?>
						<tr>
							<td><?php echo $no ?></td>
							<td><?php echo $komp['nama_bidang'];?></td>
							<td><?php echo $komp['nama_komponen']?></td>
							<td><?php echo $komp['satuan']?></td>
							<td style="width:200px; text-align:center;">
							<a class="btn btn-danger bt-delete-komponen" name="<?php echo $komp['id_komponen']; ?>">Delete</a>
                                <a  href="#modalwin" data-toggle="modal"  class="btn btn-info bt-edit-komponen" name="<?php echo $komp['id_komponen']; ?>">Edit</a>
							</td>
						</tr>
						<?php 
						$no++;
						}
						?>
					</tbody>
				</div>
			</div>
		</div>
	</div>
</div>
<script type="text/javascript" src="../assets/data-tables/jquery.dataTables.js"></script>
<script type="text/javascript" src="../assets/data-tables/DT_bootstrap.js"></script>
<script>
    jQuery(document).ready(function() {       
         // initiate layout and plugins
        App.init();
    });
</script>

<script>
var urls = 'master_komponen/komponen_action.php';

	
$('.bt-simpan-komponen').click(function(){
	var btn  = $(this);
	var load = $('#loader');
	var rslt = $('#result');
	load.addClass('spinner pull-left');
	btn.removeClass('btn-primary').addClass('btn-info');
	
	var form = $('#form_komponen');
	var data = form.serializeArray();
	var post = $.post(urls,data);
	post.done(function(res){
		var result = res.split('__');
		//   0      1     2
		//success__id__(isi tbody)tr
		if(result.length==3){
			if(result[0]=='success'){
				rslt.html('<font color="green">tersimpan...</font>');
				setTimeout(function(){
					rslt.html('');
				},1500);
				var tbody = $('#tb-komponen');
				tbody.html(result[2]);
				document.getElementById('form_komponen').reset();
				init();
			}else{
				rslt.html('<font color="red">'+res+'</font>');
			}
		}else{
			rslt.html('<font color="red">'+res+'</font>');
		}
		load.removeClass();
		btn.removeClass('btn-info').addClass('btn-primary');
	});
});
	
function init(){
$('.bt-delete-komponen').click(function(){
			var btn = $(this);
			var pid = this.name;
			var load = $(this);
			bootbox.confirm("Anda akan menghapus data ini?", function(result) {
                if(result==true){
                    if(pid!=0){
                        var post = $.post(urls,{act:'del_komponen',id_komponen:pid});
                        post.done(function(res){
                            var hasil = res.split('__');
						if(hasil.length==2){
							if(hasil[0] == 'success'){
								var tbody = $('#tb-komponen');
								tbody.html(hasil[1]);
								init();
									}
								}
                        });
                        load.html('Delete');
                    }
                }else{
                    load.html('Delete');
                }
            });
		});
	
	$('.bt-edit-komponen').click(function(){
		var id_komponen = this.name;
		var form = $('#form_komponen');
		var post = $.post(urls,{act:'edit_komponen',id_komponen:id_komponen});
		post.done(function(res){
			var value = res.split('__');
			$('#id_komponen').val(value[0]);
                form.find('select[name="id_bidang"]').val(value[1]); 
				form.find('input[name=nama_komponen]').val(value[2]);
                form.find('input[name="satuan"]').val(value[3]);
		});
	});
}

$('.geo-clear').click(function(){
	$('#id_komponen').val(0);
	document.getElementById('form_komponen').reset();
});
init();
</script>